<%@ page language="java" contentType="text/html; charset=utf-8" pageEncoding="utf-8"%>
<%@ taglib uri="http://java.sun.com/jstl/core_rt" prefix="c"%>
<head>
<jsp:include page="/views/include.jsp"></jsp:include>
<script type="text/javascript">
	var contextPath = '<%=request.getContextPath()%>';
    $.parser.onComplete = function() {
		$('body').css('visibility','visible');
		setTimeout(function() {
			$('#loading-mask').remove();
		},50);
    };
    
    function ajaxLoading(){ 
        $("<div class=\"datagrid-mask\"></div>").css({display:"block",width:"100%",height:$(window).height()}).appendTo("body"); 
        $("<div class=\"datagrid-mask-msg\"></div>").html("正在处理，请稍候。。。").appendTo("body").css({display:"block",left:($(document.body).outerWidth(true) - 190) / 2,top:($(window).height() - 45) / 2});
     } 
    
     function ajaxLoadEnd(){ 
         $(".datagrid-mask").remove(); 
         $(".datagrid-mask-msg").remove();             
    }
     
    function refresh() {
		$('#dt-dataSource').datagrid('loadData', {total:0,rows:[]});
		$('#dt-dataSource').datagrid('load',{});
	}
	
	function newItem(){
		$("#dataSource_add_dialog-buttons a:first-child").show();
		$('#dataSource_add_dialog').dialog('setTitle','增加数据源').dialog('open');
		$('#dataSource_add_form')[0].reset();
	}
	
	function editItem() {
		var row = $('#dt-dataSource').datagrid('getSelected');
		if (row) {
			$('#dataSource_update_form')[0].reset();
			$('#dataSource_update_form').formid('loadit',row);
			$('#dataSource_update_dialog').dialog('setTitle','更新数据源信息').dialog('open');
		} else {
			$.messager.show({
				title:'注意',
				msg:'请先选择数据，再进行修改。'
			});
		}
	}
	
	function updateItem() {
		$('#dataSource_update_form').form('submit', {
			url:'<c:url value="/etl/dataSourceupdate.tg"/>',
			onSubmit:function() { return true; },
			dataType:"json",
			success:function(result) {
				var data = eval("(" + result + ")");
				if(data.success) {
					$.messager.show({
						title		:	'提示',
						msg			:	data.message,
						showType	:	'slide'
					});
					$('#dataSource_update_dialog').dialog('close');
					refresh();
				} else {
					$.messager.alert('警告','操作失败！','error');
				}
			}
		});
	}
	
	function removeItem() {
		var row = $('#dt-dataSource').datagrid('getSelected');
		if (row) {
			if (confirm("数据删除后将无法恢复,确定要删除吗?")) {
				$.ajax({
					typpe			: "post",
					url 			: '<c:url value="/etl/dataSourcedelete.tg"/>',
					dataType		: 'json',
					data			: {"ds.dataSource_id" : row["dataSource_id"] },
					success			: function(result) {
						var data = eval(result);
						if (data.success) {
							$.messager.show({
								title		:	'提示',
								msg			:	"操作成功",
								showType	:	'slide'
							});
							refresh();
						} else {
							$.messager.alert('警告', data.message, 'error');
						}
					}
				});
			}
		} else {
			$.messager.show({
				title:'注意',
				msg:'请先选择数据，再进行修改。'
			});
		}
	}
	
	function refreshDataSource(){
		var row = $('#dt-dataSource').datagrid('getSelected');
		if (row) {
			if (confirm("确定要重新加载数据源吗?")) {
				ajaxLoading();
				$.ajax({
					typpe			: "post",
					url 			: '<c:url value="/etl/dataSourcereloadTable.tg"/>',
					dataType		: 'json',
					data			: {"dataSourceId" : row["dataSource_id"] },
					success			: function(result) {
						var data = eval(result);
						if (data.success) {
							$.messager.show({
								title		:	'提示',
								msg			:	"操作成功",
								showType	:	'slide'
							});
							refresh();
						} else {
							$.messager.alert('警告', data.message, 'error');
						}
						ajaxLoadEnd();
					}
				});
			}
		} else {
			$.messager.show({
				title:'注意',
				msg:'请先选择数据，再进行修改。'
			});
		}
	}
	
	function checkConnection(type) {
		var dataSource_ip = "";
		var dataSource_dialect = ""; 
		var dataSource_port = "";
		var dataSource_dbname = "";
		var dataSource_username = "";
		var dataSource_password = "";
		switch (type) {
		case "save":
			dataSource_ip 			= $("#s_dataSource_ip").val();
			dataSource_dialect 		= $("#s_dataSource_dialect").val(); 
			dataSource_port 		= $("#s_dataSource_port").val();
			dataSource_dbname 		= $("#s_dataSource_dbname").val();
			dataSource_username 	= $("#s_dataSource_username").val();
			dataSource_password 	= $("#s_dataSource_password").val();
			break;
		case "update":
			dataSource_ip 			= $("#dataSource_ip").val();
			dataSource_dialect 		= $("#dataSource_dialect").val(); 
			dataSource_port 		= $("#dataSource_port").val();
			dataSource_dbname 		= $("#dataSource_dbname").val();
			dataSource_username 	= $("#dataSource_username").val();
			dataSource_password 	= $("#dataSource_password").val();
			break;
		}
		$.ajax({
			typpe			: "post",
			url 			: '<c:url value="/etl/dataSourcecheckConnection.tg"/>',
			dataType		: 'json',
			data			: {"ds.dataSource_ip" : dataSource_ip , "ds.dataSource_dialect" : dataSource_dialect , "ds.dataSource_port" : dataSource_port , "ds.dataSource_dbname" : dataSource_dbname , "ds.dataSource_username" : dataSource_username , "ds.dataSource_password" : dataSource_password },
			success			: function(result) {
				var data = eval(result);
				if (data.success) {
					alert("连接成功");
				} else {
					alert("连接失败");
				}
			}
		});
	}
	
	function saveItem() {
		$('#dataSource_add_dialog').dialog('close');
		$('#dataSource_add_form').form('submit', {
			url:'<c:url value="/etl/dataSourcesave.tg"/>',
			onSubmit:function() { return true; },
			dataType:"json",
			beforeSend:ajaxLoading,
			success:function(result) {
				ajaxLoadEnd(); 
				var data = eval('('+result+')');
				if(data.success) {
					$.messager.show({
						title		:	'提示',
						msg			:	data.message,
						showType	:	'slide'
					});
					refresh();
				} else {
					$.messager.alert('警告', data.message ,'error');
				}
			}
		});
	}
	
	
	
	function statusFormatter(value){
		 switch (value) {
		case 0:
			return "MSSQLSERVER";
			break;
		case 1:
			return "MYSQL";
			break;
		case 2:
			return "ORACLE";
			break;
		default:
			return "未知";
			break;
		}
	}
</script>
</head>
<body style="margin: 0; padding: 0; height: 100%; overflow: hidden; background: #F2FBFF">
	<div id="mainlayout" class="easyui-layout" fit="true">
		<div region="north" border="false">
			<div class="toolbar">
				<table cellpadding="0" cellspacing="0" style="width: 95%;">
					<tr>
						<td>
							<a href="javascript:newItem()" class="easyui-linkbutton" iconCls="icon-add" plain="true">新增</a> 
							<a href="javascript:editItem()" class="easyui-linkbutton" iconCls="icon-edit" plain="true">修改</a> 
							<a href="javascript:removeItem()" class="easyui-linkbutton" iconCls="icon-cancel" plain="true">删除</a> 
							<a href="javascript:refresh()" class="easyui-linkbutton" iconCls="icon-reload" plain="true">刷新</a> 
							<a href="javascript:refreshDataSource()" class="easyui-linkbutton" iconCls="icon-reload" plain="true">重新加载数据源</a> 
						</td>
					</tr>
				</table>
			</div>
		</div>
		<div region="center" border="false">
			<table id="dt-dataSource" class="easyui-datagrid" url="<c:url value='/etl/dataSourcelistAll.tg'/>" fit="true" border="false" pagination="true" striped="true" singleSelect="true" rownumbers="true">
				<thead>
					<th field="dataSource_name" width="100">名称</th>
					<th field="dataSource_dialect" width="250" formatter="statusFormatter">类型</th>
					<th field="dataSource_ip" width="100">IP</th>
					<th field="dataSource_port" width="100">端口</th>
					<th field="dataSource_dbname" width="100">数据库</th>
					<th field="dataSource_username" width="250">用户名</th>
				</thead>
			</table>
		</div>
		<!-- 新增数据源 start -->
		<div id="dataSource_add_dialog" class="easyui-dialog" closed="true" modal="true" buttons="#dataSource_add_dialog-buttons">
			<form id="dataSource_add_form" method="post">
				<div style="padding:20px;">
					<table cellpadding="0" cellspacing="0" class="form-table">
						<tr>
							<td>数据源名称：</td>
							<td><input name="ds.dataSource_name" class="easyui-validatebox" style="width:200px" required="true"/></td>
						</tr>
						<tr>
							<td>IP地址：</td>
							<td><input id="s_dataSource_ip" name="ds.dataSource_ip" class="easyui-validatebox" style="width:200px" accept="number"/></td>
						</tr>
						<tr>
							<td>数据库类型：</td>
							<td>
								<select id="s_dataSource_dialect" name="ds.dataSource_dialect">
									<option value="0">MSSQLServer</option>
									<option value="1">MySQL</option>
									<option value="2">Oracle</option>
								</select>
							</td>
						</tr>
						<tr>
							<td>端口：</td><!-- ds.dataSource_port -->
							<td><input id="s_dataSource_port" name="ds.dataSource_port" class="easyui-numberbox" data-options="min:0,precision:2" style="width:200px" /></td>
						</tr>
						<tr>
							<td>数据库：</td>
							<td><input id="s_dataSource_dbname" name="ds.dataSource_dbname" class="easyui-validatebox" style="width:200px" /></td>
						</tr>
						<tr>
							<td>用户名：</td>
							<td><input id="s_dataSource_username" name="ds.dataSource_username" class="easyui-validatebox" style="width:200px"/></td>
						</tr>
						<tr>
							<td>密码：</td>
							<td><input id="s_dataSource_password" type="password" name="ds.dataSource_password" class="easyui-validatebox" style="width:200px"/></td>
						</tr>
					</table>
				</div>
			</form>
			<div id="dataSource_add_dialog-buttons" style="text-align: center">
				<a href="#" class="easyui-linkbutton" iconCls="icon-save" onclick="checkConnection('save')">测试连接</a>
				<a href="#" class="easyui-linkbutton" iconCls="icon-save" onclick="saveItem()">保存</a> 
				<a href="#" class="easyui-linkbutton" iconCls="icon-cancel" onclick="javascript:$('#dataSource_add_dialog').dialog('close')">关闭</a>
			</div>
		</div>
		<!-- 新增数据源 end -->
		
		<!-- 修改数据源 start -->
		<div id="dataSource_update_dialog" class="easyui-dialog" closed="true" modal="true" buttons="#dataSource_update_dialog-buttons">
			<form id="dataSource_update_form" method="post">
				<input type="hidden" id="dataSource_id" name="ds.dataSource_id">
				<div style="padding:20px">
					<table cellpadding="0" cellspacing="0" class="form-table">
						<tr>
							<td>数据源名称：</td>
							<td><input id="dataSource_name" name="ds.dataSource_name" class="easyui-validatebox" style="width:200px" required="true" /></td>
						</tr>
						<tr>
							<td>IP地址：</td>
							<td><input id="dataSource_ip" name="ds.dataSource_ip" class="easyui-validatebox" style="width:200px" /></td>
						</tr>
						<tr>
							<td>数据库类型：</td>
							<td>
								<select id="dataSource_dialect" name="ds.dataSource_dialect">
									<option value="0">MSSQLServer</option>
									<option value="1">MySQL</option>
									<option value="2">Oracle</option>
								</select>
							</td>
						</tr>
						<tr>
							<td>端口：</td>
							<td><input id="dataSource_port" name="ds.dataSource_port" class="easyui-validatebox" style="width:200px" /></td>
						</tr>
						<tr>
							<td>数据库：</td>
							<td><input id="dataSource_dbname" name="ds.dataSource_dbname" class="easyui-validatebox" style="width:200px" /></td>
						</tr>
						<tr>
							<td>用户名：</td>
							<td><input id="dataSource_username" name="ds.dataSource_username" class="easyui-validatebox" style="width:200px"/></td>
						</tr>
						<tr>
							<td>密码：</td>
							<td><input id="dataSource_password" name="ds.dataSource_password" type="password" class="easyui-validatebox" style="width:200px"/></td>
						</tr>
					</table>
				</div>
			</form>
			<div id="dataSource_update_dialog-buttons" style="text-align: center">
				<a href="#" class="easyui-linkbutton" iconCls="icon-save" onclick="checkConnection('update')">测试连接</a>
				<a href="#" class="easyui-linkbutton" iconCls="icon-save" onclick="updateItem()">保存</a> 
				<a href="#" class="easyui-linkbutton" iconCls="icon-cancel" onclick="javascript:$('#dataSource_update_dialog').dialog('close')">关闭</a>
			</div>
		</div>
		<!-- 修改数据源 end -->
	</div>
</body>